<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>图片水印并上传示例</title>
</head>
<body>
<input type="file" id="imageFile" accept="image/*">
<button onclick="addWatermark()">添加水印并上传</button>

<script th:src="@{/js/watermark.js}"></script>
<script>
    function addWatermark() {
        const imageFileInput = document.getElementById('imageFile');
        const file = imageFileInput.files[0];

        if (!file) {
            alert('请先选择图片！');
            return;
        }
        var watermarks = []
        watermarks.push("广西壮族自2心2圩街2汇11111111111111111111111112")
        watermarks.push("2024-05-11 19:13:04 ")
        watermarks.push("李华 130733376")
        const promises = [];
        for (let i = 0; i < 3; i++) {
            promises.push(addWatermarkAndUpload(file, watermarks))
        }
        Promise.all(promises)
            .then(results => {
                // 当所有Promise都完成时，results数组包含所有结果
                console.log(results); // 输出: ['Result from asyncFunction1', 'Result from asyncFunction2', 'Result from asyncFunction3']
                // 在这里你可以一起处理所有结果
                const formData = new FormData();
                for (let i = 0; i < results.length; i++) {
                    console.log(results[i])
                    formData.append('files', results[i], results[i].name);
                }
                return formData;
            })
            .then(formData => {
                f

            })
            .catch(error => {
                // 如果任何一个Promise失败，catch会被触发
                console.error('An error occurred:', error);
            });
    }

    function getImgAtom(base64) {
        var image = new Image();
        image.onload = function () {
            EXIF.getData(image, function () {
                alert(EXIF.pretty(this));
            });
        };
        image.src = base64
    }

    // 假设file是你要转换的文件对象
    function fileToBase64(file, callback) {
        const reader = new FileReader();
        reader.onload = function (e) {
            console.log(e)
            callback(e.target.result);// 这里result就是Base64编码的字符串
        };
        reader.readAsDataURL(file);
    }

    function fileToBase64(file) {
        return new Promise((resolve, reject) => {
            // 创建一个新的 FileReader 对象
            const reader = new FileReader();
            // 读取 File 对象
            reader.readAsDataURL(file);
            // 加载完成后
            reader.onload = function () {
                // 将读取的数据转换为 base64 编码的字符串
                // const base64String = reader.result.split(",")[1];
                // 解析为 Promise 对象，并返回 base64 编码的字符串
                resolve(reader.result);
            };

            // 加载失败时
            reader.onerror = function () {
                reject(new Error("Failed to load file"));
            };
        });
    }

    function jsFileToBase64(file) {
        return new Promise((resolve, reject) => {
            const reader = new FileReader();
            reader.onloadend = () => {
                const base64 = btoa(reader.result);
                resolve(base64);
            };
            reader.onerror = reject;
            reader.readAsBinaryString(file);
        });
    }

    window.onload = function () {
        EXIF.getData(document.getElementById('img1'), function () {
            EXIF.getAllTags(this);
            var orientation = EXIF.getTag(this, 'Orientation');
            console.log(orientation)
        });
        document.getElementById("base64test").onclick = function () {
            var image = new Image();
            image.onload = function () {
                EXIF.getData(image, function () {
                    alert(EXIF.pretty(this));
                });
            };
            image.src = ""
        }
        var testFilePath = "http://localhost:8080/profile/imgs/2024/05/14/S1715683268603E有位置.jpg";
        document.getElementById("blobtest").onclick = function () {
            var http = new XMLHttpRequest();
            http.open("GET", testFilePath, true);
            http.responseType = "blob";
            http.onload = function (e) {
                if (this.status === 200) {
                    EXIF.getData(http.response, function () {
                        alert(EXIF.pretty(this));
                    });
                }
            };
            http.send();
        }
    }
</script>
</body>
</html>